$primary-color: #165dff;
$font-size-base: 14px;

// 主色调相关变量
$primary-color: #42b983; // 主色调（默认使用Vue绿色，可根据需要修改）
$primary-color-dark: #359e6f; // 主色调深色（用于hover状态）
$primary-accent: #66cc99; // 强调色（用于偶数粒子背景）

// 文本相关变量
$text-color: #333333; // 主要文本色
$text-muted: #666666; // 次要文本色（用于描述文字）

// 背景相关变量
$tag-bg: #f0f7f3; // 标签背景色
$card-bg: #ffffff; // 卡片背景色
$hover-bg: #f5f5f5; // 悬停背景色

// 边框和线条相关变量
$line-color: #e0e0e0; // 分割线颜色

// 导出为CSS变量，供组件内直接使用
:root {
  --primary-color: #{$primary-color};
  --primary-color-dark: #{$primary-color-dark};
  --accent: #{$primary-accent};
  --text: #{$text-color};
  --text-muted: #{$text-muted};
  --tag-bg: #{$tag-bg};
  --card-bg: #{$card-bg};
  --hover: #{$hover-bg};
  --line: #{$line-color};
}
